<%-- 
    Document   : consultarNR
    Created on : 17-feb-2011, 22:54:25
    Author     : h-m
--%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<% request.setAttribute("allowed", "Gestionar Notificaciones de Riesgo");%>
<%@ include file='../Templates/security.jsp' %>

<%-- Para hacer los consultar es necesario:
        - Agregar el método consultar al archivo DAO
        - Modificar el Action
        - Crear un archivo listar
        - NO es necesario un form

Para hacer el sort de la tabla:
    Cambiar el encabezado a JAVASCRIPT
    poner en thead el id="head"
    Hay que modificar el jsp:
        -> Agregar una variable order y asc=true
        -> Agregar la funcion orden
        -> por cada atributo agregar la funcion ordenar
    Hay que modificar en el Action:
        -> Agregar la verificacion de variable vacia y añadirla al where
        -> Cambiar el JSONObject por JSONArray
    Hay que modificar el DAO
        -> Cambiar el JSONObject que devuelve la funcion consultar por JSONArray

--%>
<%-- Estos script se usan para mostrar las consultas y los datos a consultar --%>
<script type="text/javascript">
    var ci = "";
    var nacionalidad = "";
    var nombre_puesto = "";
    var realizado_por = "";
    var status = "";

    // Estas no cambian
    var offset = 0;
    var tam = 0;
    var limit = 0;
    var order = "";
    var asc = true;

    // Llamamos al método por primera vez para obtener el tamna
    //consultarNR();
    function mostrarTodo(){
        ci = "";
        nacionalidad = "";
        nombre_puesto = "";
        realizado_por = "";
        status = "";
        consultarNR();
    }
    consultarNR();
    function consultarNR(){
        $.getJSON("consultarNR.do",{ci: ci, nacionalidad: nacionalidad,
            nombre_puesto :nombre_puesto, realizado_por: realizado_por, status: status,
            limit: limit, offset: offset, order: order},
        function(data) {

            // (Cambia en todos los script)
            // Lo unico que cambia en esta parte es el llamado del método
            if(limit != 0){

                $('#head').empty();
                var head = "<tr>"+
                    "<th><h14>"+
                    "<div class=\"ordenar\" onclick=\"orden('nombre_puesto');\" >"+
                    "  Puesto de Trabajo </div></h14></th>"+
                    "<th><h14>"+
                    "<div class=\"ordenar\" onclick=\"orden('ci');\" >"+
                    "  C.I. </div></h14></th>"+
                    "<th><h14>"+
                    "<div class=\"ordenar\" onclick=\"orden('realizado_por');\" >"+
                    "  Realizado Por </div></h14></th>"+
                    "<th><h14>"+
                    "<div class=\"ordenar\" onclick=\"orden('fecha_notificacion');\" >"+
                    "  Fecha Notificación </div></h14></th>"+
                    "<th><h14>"+
                    "<div class=\"ordenar\" onclick=\"orden('status');\" >"+
                    "  Status </div></h14></th>"+
                    "<th><h14> Ver Pdf </h14></th>"+
                    "</tr>"
                $('#head').append(head);

                $('#resultado').empty();
                var fila = 0;
                $.each(data.consultarNR , function(i,item){
                    // Esto se hace para pintar el fondo de las filas pares e impares. (NO CAMBIA)
                    if ( (i % 2) == 0){
                        fila = "<tr bgcolor = \"#fff\"> ";
                    }
                    else{
                        fila = "<tr bgcolor = \"#ecf2f6\">";
                    }

                    var string = fila+"<td>"+item.nombre_puesto+"</td><td>"+
                        item.ci+"</td><td>"+item.realizado_por+"</td><td>"
                        +item.fecha_notificacion+"</td><td>"+item.status+"</td>"+
                        "<td ><a href='generarPdfNotificacion.do?id_notificacion_riesgo="+item.id_notificacion_riesgo+"&imagePath="+imagePath_SHA+"'><img src='style/images/pdf.gif' alt='Generar Pdf' width='20' height='20'></a></td></tr>";

                    fila++;
                    $('#resultado').append(string);
                    // Aqui se decide las paginas: Actual y totales (NO CAMBIA)
                    tam = parseInt(item.tam);
                    $("#currentpage").empty();
                    $("#pagelimit").empty();
                    $("#currentpage").append((offset/limit)+1);
                    $("#pagelimit").append(Math.ceil(tam/limit));
                });
            }else{
                // Se pinta la tabla en la página. (Cambia en todos los script)
                // Lo unico que cambia en todos los script es el llamado a la función.
                $.each(data.consultarNR , function(i,item){
                    tam = parseInt(item.tam);
                });
                limit = 10;
            }
        }
    );
        /* Agregar esta linea*/
        document.getElementById('controls').style.visibility="visible";
        /* Agregar esta linea*/
    }

    function orden(key){
        if (asc == true){
            order = "order by "+key+" asc ";
            consultarNR();
        }
        else{
            order = "order by "+key+" desc ";
            consultarNR();
        }
        asc = !asc;
    }

    function setNombrePuesto(idnpuesto){
        offset = 0;
        nombre_puesto = idnpuesto;
        consultarNR();
    }
    function setCi(idci){
        offset = 0;
        ci = idci;
        consultarNR();
    }
    function setNacionalidad(){
        offset = 0;
        nacionalidad = $('#nacionalidad :selected').val();
        consultarNR();
    }
    function setRealizadoPor(idrealizadopor){
        offset = 0;
        realizado_por = idrealizadopor;
        consultarNR();
    }
    function setStatus(idstatus){
        offset = 0;
        status = idstatus;
        consultarNR();
    }
    // Se fija el número de páginas totales de la consulta
    function setLimit(limite){
        offset = 0;
        limit = parseInt(limite);
        consultarNR();
    }

    // Se fijan los alcances de las flechas primera, última, siguiente y anterior
    function setOffset(i, completo){
        if(completo && (i==-1)){
            offset = 0;
        }
        else if(completo && (i==1)){
            offset = Math.floor((tam-1)/limit)*limit;
        }
        else if(!completo && i==-1){
            if(offset>=limit){
                offset -= limit;
            }
        }
        else{ //!completo && i==1
            if(offset<tam-limit){
                offset += limit;
            }
        }
        consultarNR();
    }

</script>

<script type="text/javascript">
    // Este script determina que la primera vez que se ve la tabla (sin resultados),
    // el numero de paginas y la pagina actual serán 1. (NO CAMBIA)
    if(limit == 0){
        $("#currentpage").append(1);
        $("#pagelimit").append(1)
    }
</script>

<h1 class="title">Gestión de Notificación de Riesgo</h1>
<hr>
<p class="meta"></p>
<div class="entry">
    <center>

        <h2>Consultar Notificación de Riesgo</h2>
        <table>
            <tbody>
            <br>
            <tr>
                <td>
                    <br>Cédula del Implicado:
                </td>
                <td><select name="nacionalidad" id="nacionalidad" onchange="setNacionalidad(value)">
                        <option value="V" selected>V</option>
                        <option value="E">E</option>
                    </select>
                    <input name="ci" onchange="setCi(value)" onblur="setNacionalidad()"/>
                </td>
            </tr>
            <tr>
                <td>Puesto de Trabajo:</td>
                <td>
                    <input id="nombre_puesto" name="nombre_puesto" onchange="setNombrePuesto(value)"/>
                </td>
            </tr>
            <tr>
                <td>Realizado por:</td>
                <td>
                    <input id="realizado_por" name="realizado_por" onchange="setRealizadoPor(value)"/>
                </td>
            </tr>
            <tr>
                <td>Estado:</td>
                <td>
                    <select name="status" onchange="setStatus(value)">
                        <option value=""></option>
                        <option value="activo">Activo</option>
                        <option value="pasivo">Pasivo</option>
                    </select>
                </td>
            </tr>
            </tbody>
        </table>
        <br>
        <br>
        <html:button property="" value="  Mostrar Todo  " onclick="mostrarTodo()"/>
        <html:button property="" styleId="PT" value="  Atrás  "/>

        <br><div style="clear: both;">&nbsp;</div><br>
        <div id="obs"></div><br>
        <%-- AQUI COMIENZA LA IMPRESION DE LA TABLA DE RESULTADOS --%>
        <div id="consultarNR" style="overflow:auto">

            <table cellpadding="0" cellspacing="0" border="0" id="table" class="sortable"  >
                <thead id="head">
                </thead>
                <tbody id="resultado">
                </tbody>
            </table>

        </div>
        <div style="clear: both;">&nbsp;</div>


        <%-- Aquí se manejan las flechas, cantidad de paginas a mostrar y numero de pagina --%>
        <%-- esto no es necesario cambiarlo --%>
        <%@ include file="../Templates/paginasTabla.jsp" %>

    </center>
</div>
<div style="clear: both;">&nbsp;</div>
<script type="text/javascript">
    /* Agregar esta linea*/
    document.getElementById('controls').style.visibility="hidden";
    /* Agregar esta linea*/
</script>